<template>
  <el-dialog
    :title="title"
    :visible.sync="isShow"
    :close-on-click-modal="false"
    width="400px"
    @close="resetDialog"
    append-to-body
  >
    <el-form size="small" :show-message="false">
      <el-row>
        <el-col :span="24">
        <el-form-item label="事件名称原名：">
          <el-input v-model="row.episode_name" placeholder="请输入" readonly />
        </el-form-item>
        </el-col>
        <el-col :span="24">
        <el-form-item label="事件名称新名：" required>
          <span slot="label">事件名称新名<span class="c-yellow">（不能使用特殊字符“&=+”）</span>：</span>
          <el-input v-model="form.new_name" placeholder="请输入" />
        </el-form-item>
        </el-col>
      </el-row>
    </el-form>
  <div slot="footer" class="dialog-footer">
      <el-button size="small" @click="isShow = false">取 消</el-button>
      <el-button :loading="btnLoading" size="small" type="primary" @click="submitForm">保 存</el-button>
    </div>
  </el-dialog>
</template>

<script>
export default {
  data(){
    return{
      title: '污染事件重命名',
      isShow: false,
      btnLoading: false,
      row: {},
      form:{
        id: null,
        new_name: null,
      },
      defaultForm: {},
    }
  },
  created(){
    this.defaultForm = JSON.parse(JSON.stringify(this.form));
  },
  methods:{
    init(row){
      this.row = row;
      this.form.id = row.id;
      this.isShow = true;
    },
    resetDialog(){
      this.form = JSON.parse(JSON.stringify(this.defaultForm));
      this.new_repassword = null;
    },
    verifyForm(){
      if(!this.$verify.null(this.form.new_name, '请输入事件名称新名')){
        return false
      }
      let reg = /[&=+]/;
      if(reg.test(this.form.new_name)){
        this.$message.warning('名称不能使用特殊字符“&=+”');
        return false
      }

      return true;
    },
    submitForm(){
      if(!this.verifyForm()){
        return;
      }
      this.btnLoading = true;
      this.$request('get', '/stations/pollute_incidence_rename', this.form, (data,msg) => {
        if(data.msg == '更新成功'){
          this.isShow = false;
          this.$message.success(data.msg);
          this.$emit('confirm');
        }else{
          this.$message.error(data.msg);
        }        
        this.btnLoading = false;
      }, msg => {
        this.btnLoading = false;
      })
    }
  }
}
</script>

<style>

</style>